<template>
	<view>
		<template v-for="(item,index) in goods" :key="index">
			<uni-card :title="item.type" :is-full="false"  sub-title="副标题" :extra="item.type" :thumbnail="item.img">
			</uni-card>
		</template>
	</view>
</template>

<script setup>
	import {
		ref
	} from "vue"
	import {
		onLoad
	} from "@dcloudio/uni-app"
	import {
		getTypeListByPid
	} from "@/api/index.js"

	onLoad((option) => {
		getTypeListByPid(option.id).then(e => {
			console.log(e, 35)
			goods.value = e.data
		})
	})
	const goods = ref([{
		id: 1,
		img: 'https://axhub.im/ax9/c875ba3dcbdc9be9/images/%E6%90%9C%E7%B4%A2%E7%BB%93%E6%9E%9C/u16.svg',
		title: 'sw1系列万能式断路由器'
	}])

	function goBack() {
		uni.navigateBack()
	};
</script>

<style>
	.search_box {
		width: 100vw;
		height: 100vh;
		background-color: #fff;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.uni-navbar,
	.goods_box {
		width: 90%;
	}


	:deep(.uni-navbar__header-btns) {
		width: 50% !important;
	}

	:deep(.uni-navbar__header-btns .uni-icons) {
		font-weight: bold;
		font-size: 50rpx !important;
		color: black !important;
	}

	:deep(.uni-navbar-btn-text>uni-text) {
		font-weight: bold;
		font-size: 30rpx !important;
		color: black !important;
	}

	.goods {
		display: flex;
		padding: 40rpx;
		margin-top: 30rpx;
		box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.643137254901961);
		border-radius: 10rpx;
		justify-content: space-between;
	}

	.goods img {
		width: 160rpx;
		height: 200rpx;
	}

	.goods_box_right {
		/* background-color: palegoldenrod; */
		width: 65%;
		display: flex;
		justify-content: space-between;
		flex-direction: column;

	}

	.goods_title {
		font-size: 30rpx;
		font-weight: bold;
	}

	.goods_btn {
		display: flex;
		justify-content: flex-end;
	}

	.goods_btn button {
		font-size: 30rpx;
		width: 200rpx;
		background-color: #E60012;
		color: #fff;
		margin: 0;
	}
</style>